<!-- src/edit.html -->
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>文件上传</title>
  <link rel="icon" type="image/x-icon" href="assets/favicon.ico"> 
  <style type="text/css">  
  .list { 
    display: none;
    margin: 16px 8px;  

    position: relative;
    border-radius: 16px; 

    --md-elevation-level: 1;
  }

  #fileList { 
    display: none; 
    max-height: calc(100vh - 100px);
    overflow-y: auto;
  }

  .data-item-content {
    padding: 4px 8px;
    display: flex;
    justify-content: space-between;
    
  }
  .data-item-content span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .data-item-content span:first-child {
    flex: 1; 
  }
   .data-item-content span:not(:first-child) {
    width: 100px;
  }

  .data-item-content span:last-child {
    text-align: center;
  }


  #progress{
    display: none;
  }

  md-circular-progress{
    width: 24px;
    height: 24px;
  }
  </style>
  
</head>
<body>
  <script src="ispace_rscm/index.js"></script>
  <!-- 表单 -->
  <div class="form"> 
    <!-- 文件夹时，文件夹选择 folder -->
     <md-outlined-button id="uploadFolder">上传文件夹</md-outlined-button>  
     <!-- 文件时，多文件选择 file -->
     <md-outlined-button id="uploadFile">上传文件</md-outlined-button>   
    <!-- 提交按钮 -->
     <md-outlined-button id="submit">上传</md-outlined-button> 
  </div> 
      <!-- 清单 -->  
      <div class="list">
      <md-elevation></md-elevation>
      <md-linear-progress id="progress"></md-linear-progress>
      <md-list id="fileList">
       </md-list>   
      </div>
 
  <!-- 日志 -->
  <div id="log"></div>
  </div>
</body>
</html>